<template>
	<Grid :col="3" :border="false" padding="5px">
	  <GridItem> <Input  placeholder="请输入用户名" /></GridItem>
	  <GridItem><Input  placeholder="请输入真实姓名" /></GridItem>
	  <GridItem>
		  <Select style="width:100%" clearable  placeholder="请选择用户的状态">
			  <Option v-for="item in statusList" :value="item.value" :key="item.value">{{ item.label }}</Option>
		  </Select>
	  </GridItem>
	  <GridItem><Input  placeholder="请输入手机号" /></GridItem>
	  <GridItem> <DatePicker type="daterange" confirm placement="bottom-end" placeholder="请选择入职时间" style="width: 100%;"/></GridItem>
	  <GridItem><Button icon="md-search" type="primary">查询</Button></GridItem>
	</Grid>
	
	<Grid :col="1" :border="false" padding="5px">
	  <GridItem><Button icon="md-add-circle" type="primary" @click="$emit('add-user')">新增用户</Button></GridItem>
	</Grid>
</template>

<script>

export default {
	data() {
		return {
			statusList: [{label: '正常',  value: 0},  {label: '锁定', value : 1}]
		}
	},
	emits: ['add-user'] ,
}

</script>

<style>
</style>